<!-- 动画路由框 -->

<template>
  <transition :name="sid||'kk'" mode="out-in">
    <router-view />
  </transition>
</template>

<script>
export default {
  // 组件名称
  name: "kk-router",

  // 接收参数
  props: {
    sid: null // 公共CSS的识别
  }
};
</script>

<style scoped>
.kk-enter,
.kk-leave-to {
  opacity: 0;
}

.kk-enter-active,
.kk-leave-active {
  transition: opacity 0.25s linear;
}
</style>